<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <title>Hello MUI</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="../css/mui.min.css">
    <style>
      html,
      body {
        background-color: #efeff4;
      }
      .mui-views,
      .mui-view,
      .mui-pages,
      .mui-page,
      .mui-page-content {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background-color: #efeff4;
      }
      .mui-pages {
        top: 46px;
        height: auto;
      }
      .mui-scroll-wrapper,
      .mui-scroll {
        background-color: #efeff4;
      }
      .mui-page.mui-transitioning {
        -webkit-transition: -webkit-transform 300ms ease;
        transition: transform 300ms ease;
      }
      .mui-page-left {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
      .mui-ios .mui-page-left {
        -webkit-transform: translate3d(-20%, 0, 0);
        transform: translate3d(-20%, 0, 0);
      }
      .mui-navbar {
        position: fixed;
        right: 0;
        left: 0;
        z-index: 10;
        height: 44px;
        background-color: #f7f7f8;
      }
      .mui-navbar .mui-bar {
        position: absolute;
        background: transparent;
        text-align: center;
      }
      .mui-android .mui-navbar-inner.mui-navbar-left {
        opacity: 0;
      }
      .mui-ios .mui-navbar-left .mui-left,
      .mui-ios .mui-navbar-left .mui-center,
      .mui-ios .mui-navbar-left .mui-right {
        opacity: 0;
      }
      .mui-navbar .mui-btn-nav {
        -webkit-transition: none;
        transition: none;
        -webkit-transition-duration: .0s;
        transition-duration: .0s;
      }
      .mui-navbar .mui-bar .mui-title {
        display: inline-block;
        position: static;
        width: auto;
      }
      .mui-page-shadow {
        position: absolute;
        right: 100%;
        top: 0;
        width: 16px;
        height: 100%;
        z-index: -1;
        content: '';
      }
      .mui-page-shadow {
        background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
        background: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
      }
      .mui-navbar-inner.mui-transitioning,
      .mui-navbar-inner .mui-transitioning {
        -webkit-transition: opacity 300ms ease, -webkit-transform 300ms ease;
        transition: opacity 300ms ease, transform 300ms ease;
      }
      .mui-page {
        display: none;
      }
      .mui-pages .mui-page {
        display: block;
      }
      .mui-page .mui-table-view:first-child {
        margin-top: 15px;
      }
      .mui-page .mui-table-view:last-child {
        margin-bottom: 30px;
      }
      .mui-table-view {
        margin-top: 20px;
      }
      .mui-table-view:after {
        height: 0;
      }
      .mui-table-view span.mui-pull-right {
        color: #999;
      }
      .mui-table-view-divider {
        background-color: #efeff4;
        font-size: 14px;
      }
      .mui-table-view-divider:before,
      .mui-table-view-divider:after {
        height: 0;
      }
      .head {
        height: 40px;
      }
      #head {
        line-height: 40px;
      }
      .head-img {
        width: 40px;
        height: 40px;
      }
      #head-img1 {
        position: absolute;
        bottom: 10px;
        right: 40px;
        width: 40px;
        height: 40px;
      }
      .update {
        font-style: normal;
        color: #999999;
        margin-right: -25px;
        font-size: 15px
      }
      .mui-fullscreen {
        position: fixed;
        z-index: 20;
        background-color: #000;
      }
    </style>
  </head>

  <body>
    <!--页面主结构开始-->
    <div id="app" class="mui-views">
      <div class="mui-view">
        <div class="mui-navbar">
        </div>
        <div class="mui-pages">
        </div>
      </div>
    </div>
    <!--页面主结构结束-->
    <!--单页面开始-->
    <div id="setting" class="mui-page">
      <!--页面标题栏开始-->
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>
        </button>
        <h1 class="mui-center mui-title">设置</h1>
      </div>
      <!--页面标题栏结束-->
      <!--页面主内容区开始-->
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <div class="mui-scroll">
            <ul class="mui-table-view mui-table-view-chevron">
              <li class="mui-table-view-cell mui-media">
                <a class="mui-navigate-right" href="#account">
                  <img class="mui-media-object mui-pull-left head-img" id="head-img" src="">
                  <div class="mui-media-body">
                    Hello MUI
                    <p class='mui-ellipsis'>账号:hellomui</p>
                  </div>
                </a>
              </li>
            </ul>
            <ul class="mui-table-view mui-table-view-chevron">
              <li class="mui-table-view-cell">
                <a href="#account" class="mui-navigate-right">账号与安全</a>
              </li>
            </ul>
            <ul class="mui-table-view mui-table-view-chevron">
              <li class="mui-table-view-cell">
                <a href="#notifications" class="mui-navigate-right">新消息通知</a>
              </li>
              <li class="mui-table-view-cell">
                <a href="#privacy" class="mui-navigate-right">隐私</a>
              </li>
              <li class="mui-table-view-cell">
                <a href="#general" class="mui-navigate-right">通用</a>
              </li>
            </ul>
            <ul class="mui-table-view mui-table-view-chevron">
              <li class="mui-table-view-cell">
                <a href="#about" class="mui-navigate-right">关于MUI <i class="mui-pull-right update">V1.9.0</i></a>
              </li>
            </ul>
            <ul class="mui-table-view mui-table-view-chevron">
              <li class="mui-table-view-cell">
                <a href="#lock" class="mui-navigate-right">设置锁屏图案</a>
              </li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell" style="text-align: center;">
                <a id="exit">退出登录</a>
                <a id="restart-app">重启</a>
                <a id="clear-restart-app">clear-restart-app</a>

              </li>
            </ul>
          </div>
        </div>
      </div>
      <!--页面主内容区结束-->
    </div>
    <!--单页面结束-->
    <div id="account" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>设置
        </button>
        <h1 class="mui-center mui-title">账号与安全</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <ul class="mui-table-view">
            <li class="mui-table-view-cell">
              <a id="head" class="mui-navigate-right">头像
								<span class="mui-pull-right head">
									<img class="head-img mui-action-preview" id="head-img1" src=""/>
								</span>
							</a>
            </li>
            <li class="mui-table-view-cell">
              <a>姓名<span class="mui-pull-right">Hbuilder</span></a>
            </li>
            <li class="mui-table-view-cell">
              <a>HBuilder账号<span class="mui-pull-right">hbuilder@dcloud.io</span></a>
            </li>
          </ul>
          <ul class="mui-table-view">
            <li class="mui-table-view-cell">
              <a>QQ号<span class="mui-pull-right">88888888</span></a>
            </li>
            <li class="mui-table-view-cell">
              <a>手机号<span class="mui-pull-right">18601234567</span></a>
            </li>
            <li class="mui-table-view-cell">
              <a>邮箱地址<span class="mui-pull-right">hbuilder@dcloud.io</span></a>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <div id="notifications" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>设置
        </button>
        <h1 class="mui-center mui-title">新消息通知</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <div class="mui-scroll">
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                <a>接收新消息通知<span class="mui-pull-right">已开启</span></a>
              </li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                通知显示消息详情
                <div class="mui-switch mui-active mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
            </ul>
            <div class="mui-content-padded">
              <p>若关闭，当收到新消息时，通知提示将不显示发信人和内容摘要</p>
            </div>

            <ul class="mui-table-view mui-table-view-chevron">
              <li class="mui-table-view-cell">
                <a href="#notifications_disturb" class="mui-navigate-right">功能消息免打扰</a>
              </li>
            </ul>
            <div class="mui-content-padded">
              <p>设置系统功能消息提示声音和震动的时段</p>
            </div>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                <a>接收新消息通知<span class="mui-pull-right">已开启</span></a>
              </li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                声音
                <div class="mui-switch mui-active mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
              <li class="mui-table-view-cell">
                震动
                <div class="mui-switch mui-active mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
            </ul>
            <div class="mui-content-padded">
              <p>当HelloMUI在运行时，你可以设置是否需要声音或者震动</p>
            </div>
            <div></div>
          </div>
        </div>
      </div>
    </div>
    <div id="notifications_disturb" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>新消息通知
        </button>
        <h1 class="mui-center mui-title">功能消息免打扰</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <div class="mui-scroll">
            <ul class="mui-table-view mui-table-view-radio">
              <li class="mui-table-view-cell">
                <a class="mui-navigate-right">开启</a>
              </li>
              <li class="mui-table-view-cell">
                <a class="mui-navigate-right">只在夜间开启</a>
              </li>
              <li class="mui-table-view-cell">
                <a class="mui-navigate-right">关闭</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div id="privacy" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>设置
        </button>
        <h1 class="mui-center mui-title">隐私</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <div class="mui-scroll">
            <ul class="mui-table-view">
              <li class="mui-table-view-divider">通讯录</li>
              <li class="mui-table-view-cell">
                加我为朋友时需要验证
                <div class="mui-switch mui-active mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                向我推荐QQ好友
                <div class="mui-switch mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
              <li class="mui-table-view-cell">
                通过QQ号搜索到我
                <div class="mui-switch mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                可通过手机号搜索到我
                <div class="mui-switch mui-active mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
              <li class="mui-table-view-cell">
                向我推荐通讯录朋友
                <div class="mui-switch mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
              <li class="mui-table-view-divider">开启后，为你推荐已经开通HBuilder的手机联系人</li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                通过HBuilder账号搜索到我
                <div class="mui-switch mui-active mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
              <li class="mui-table-view-divider">关闭后，其他用户将不能通过HBuilder号搜索到你</li>
            </ul>

          </div>
        </div>
      </div>
    </div>
    <div id="general" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>设置
        </button>
        <h1 class="mui-center mui-title">通用</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <div class="mui-scroll">
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                多语言
              </li>
            </ul>

            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                听筒模式
                <div class="mui-switch mui-switch-mini">
                  <div class="mui-switch-handle"></div>
                </div>
              </li>
            </ul>
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                功能
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>

    <div id="about" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>设置
        </button>
        <h1 class="mui-center mui-title">关于MUI</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-scroll-wrapper">
          <div class="mui-scroll">
            <ul class="mui-table-view">
              <li class="mui-table-view-cell">
                <a id="rate" class="mui-navigate-right">评分鼓励</a>
              </li>
              <li class="mui-table-view-cell">
                <a id="welcome" class="mui-navigate-right">欢迎页</a>
              </li>
              <li class="mui-table-view-cell">
                <a id="share" class="mui-navigate-right">分享推荐</a>
              </li>
              <li class="mui-table-view-cell">
                <a id="tel" class="mui-navigate-right">客服电话</a>
              </li>
              <li class="mui-table-view-cell">
                <a id="update" class="mui-navigate-right">检查更新</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div id="lock" class="mui-page">
      <div class="mui-navbar-inner mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
          <span class="mui-icon mui-icon-left-nav"></span>设置
        </button>
        <h1 class="mui-center mui-title">锁屏图案</h1>
      </div>
      <div class="mui-page-content">
        <div class="mui-content-padded">
          <ul class="mui-table-view mui-table-view-chevron">
            <li class="mui-table-view-cell">
              使用手势解锁
              <div id="lockState" class="mui-switch">
                <div class="mui-switch-handle"></div>
              </div>
            </li>
          </ul>
          <div class="mui-locker" data-locker-width='320' data-locker-height='320' data-locker-options='{"ringColor":"rgba(221,221,221,1)","fillColor":"#ffffff","pointColor":"rgba(0,136,204,1)","lineColor":"rgba(0,136,204,1)"}'>
          </div>
        </div>
      </div>
    </div>

  </body>
  <script src="../js/mui.min.js "></script>
  <script src="../js/mui.view.js "></script>
  <script src="../js/vue.min.js"></script>
  <script src="../app/vue-html5.js"></script>
  <script src="../js/app.js"></script>
  <script>
    window.vm = vm = new Vue.PageVm({
      el: 'body',
      name: 'page Settings',
      plusReady: function() {
        localStorage['$webview:' + window.__WebVieW_Id__ + ':readyShow'] = true;
      }
    });
    mui.init();
     //初始化单页view
    var viewApi = mui('#app').view({
      defaultPage: '#setting'
    });
     //初始化单页的区域滚动
    mui('.mui-scroll-wrapper').scroll();
     //分享操作
    var shares = {};
    mui.plusReady(function() {
      plus.share.getServices(function(s) {
        if (s && s.length > 0) {
          for (var i = 0; i < s.length; i++) {
            var t = s[i];
            shares[t.id] = t;
          }
        }
      }, function() {
        console.log("获取分享服务列表失败");
      });
      defaultImg();
      setTimeout(function() {
        initImgPreview();
      }, 500);
    });
    document.getElementById("restart-app").addEventListener('tap', function() {
      plus.runtime.restart();
    })
     document.getElementById("clear-restart-app").addEventListener('tap', function() {
        plus.storage.clear();
        localStorage.clear();
        plus.runtime.restart();
      })
      //退出操作******************
     document.getElementById('exit').addEventListener('tap', function() {
      if (mui.os.ios) {
        app.setState({});
        mui.openWindow({
          url: '../login.html',
          id: 'login',
          show: {
            aniShow: 'pop-in'
          },
          waiting: {
            autoShow: false
          }
        });
        return;
      }
      var btnArray = [{
        title: "注销当前账号"
      }, {
        title: "直接关闭应用"
      }];
      plus.nativeUI.actionSheet({
        cancel: "取消",
        buttons: btnArray
      }, function(event) {
        var index = event.index;
        switch (index) {
          case 1:
            app.setState({});
            mui.openWindow({
              url: 'login.html',
              id: 'login',
              show: {
                aniShow: 'pop-in'
              },
              waiting: {
                autoShow: false
              }
            });
            break;
          case 2:
            plus.runtime.quit();
            break;
        }
      });
    }, false);
     //************************
     //分享链接点击事件
    document.getElementById("share").addEventListener('tap', function() {
      var ids = [{
          id: "weixin",
          ex: "WXSceneSession"
        }, {
          id: "weixin",
          ex: "WXSceneTimeline"
        }, {
          id: "sinaweibo"
        }, {
          id: "tencentweibo"
        }, {
          id: "qq"
        }],
        bts = [{
          title: "发送给微信好友"
        }, {
          title: "分享到微信朋友圈"
        }, {
          title: "分享到新浪微博"
        }, {
          title: "分享到腾讯微博"
        }, {
          title: "分享到QQ"
        }];
      plus.nativeUI.actionSheet({
        cancel: "取消",
        buttons: bts
      }, function(e) {
        var i = e.index;
        if (i > 0) {
          var s_id = ids[i - 1].id;
          var share = shares[s_id];
          if (share) {
            if (share.authenticated) {
              shareMessage(share, ids[i - 1].ex);
            } else {
              share.authorize(function() {
                shareMessage(share, ids[i - 1].ex);
              }, function(e) {
                console.log("认证授权失败：" + e.code + " - " + e.message);
              });
            }
          } else {
            mui.toast("无法获取分享服务，请检查manifest.json中分享插件参数配置，并重新打包")
          }
        }
      });
    });

    function shareMessage(share, ex) {
        var msg = {
          extra: {
            scene: ex
          }
        };
        msg.href = "http://www.dcloud.io/hellomui/";
        msg.title = "最接近原生APP体验的高性能前端框架";
        msg.content = "我正在体验HelloMUI，果然很流畅，基本看不出和原生App的差距";
        if (~share.id.indexOf('weibo')) {
          msg.content += "；体验地址：http://www.dcloud.io/hellomui/";
        }
        msg.thumbs = ["_www/images/logo.png"];
        share.send(msg, function() {
          console.log("分享到\"" + share.description + "\"成功！ ");
        }, function(e) {
          console.log("分享到\"" + share.description + "\"失败: " + e.code + " - " + e.message);
        });
      }
      //去评分
    document.getElementById("rate").addEventListener('tap', function() {
      if (mui.os.ios) {
        location.href = 'https://itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?id=682211190&pageNumber=0&sortOrdering=2&type=&mt=8';
      } else if (mui.os.android) {
        plus.runtime.openURL("market://details?id=io.dcloud.HelloMUI", function(e) {
          plus.runtime.openURL("market://details?id=io.dcloud.HelloMUI", function(e) {
            mui.alert("360手机助手和应用宝，你一个都没装，暂时无法评分，感谢支持");
          }, "com.qihoo.appstore");
        }, "com.tencent.android.qqdownloader");
      }
    });
     //客服电话
    document.getElementById("tel").addEventListener('tap', function() {
      plus.device.dial("114");
    });
     //		//意见反馈
     //		document.getElementById("quest").addEventListener('tap', function() {
     //			
     //		});
     //		
     //检查更新
    document.getElementById("update").addEventListener('tap', function() {
      var server = "http://www.dcloud.io/check/update"; //获取升级描述文件服务器地址
      mui.getJSON(server, {
        "appid": plus.runtime.appid,
        "version": plus.runtime.version,
        "imei": plus.device.imei
      }, function(data) {
        if (data.status) {
          plus.ui.confirm(data.note, function(i) {
            if (0 == i) {
              plus.runtime.openURL(data.url);
            }
          }, data.title, ["立即更新", "取　　消"]);
        } else {
          mui.toast('Hello MUI 已是最新版本~')
        }
      });
    });
    var view = viewApi.view;
    (function($) {
      //处理view的后退与webview后退
      var oldBack = $.back;
      $.back = function() {
        if (viewApi.canBack()) { //如果view可以后退，则执行view的后退
          viewApi.back();
        } else { //执行webview后退
          oldBack();
        }
      };
      //监听页面切换事件方案1,通过view元素监听所有页面切换事件，目前提供pageBeforeShow|pageShow|pageBeforeBack|pageBack四种事件(before事件为动画开始前触发)
      //第一个参数为事件名称，第二个参数为事件回调，其中e.detail.page为当前页面的html对象
      view.addEventListener('pageBeforeShow', function(e) {
        //				console.log(e.detail.page.id + ' beforeShow');
      });
      view.addEventListener('pageShow', function(e) {
        //				console.log(e.detail.page.id + ' show');
      });
      view.addEventListener('pageBeforeBack', function(e) {
        //				console.log(e.detail.page.id + ' beforeBack');
      });
      view.addEventListener('pageBack', function(e) {
        //				console.log(e.detail.page.id + ' back');
      });
    })(mui);
     //更换头像
    mui(".mui-table-view-cell").on("tap", "#head", function(e) {
      var a = [{
        title: "拍照"
      }, {
        title: "从手机相册选择"
      }];
      plus.nativeUI.actionSheet({
        title: "修改头像",
        cancel: "取消",
        buttons: a
      }, function(b) {
        switch (b.index) {
          case 0:
            break;
          case 1:
            getImage();
            break;
          case 2:
            galleryImg();
            break;
          default:
            break
        }
      })
    });

    function getImage() {
      var c = plus.camera.getCamera();
      c.captureImage(function(e) {
        plus.io.resolveLocalFileSystemURL(e, function(entry) {
          var s = entry.toLocalURL() + "?version=" + new Date().getTime();
          console.log(s);
          document.getElementById("head-img").src = s;
          document.getElementById("head-img1").src = s;
          //变更大图预览的src
          //目前仅有一张图片，暂时如此处理，后续需要通过标准组件实现
          document.querySelector("#__mui-imageview__group .mui-slider-item img").src = s + "?version=" + new Date().getTime();;;
        }, function(e) {
          console.log("读取拍照文件错误：" + e.message);
        });
      }, function(s) {
        console.log("error" + s);
      }, {
        filename: "_doc/head.jpg"
      })
    }

    function galleryImg() {
      plus.gallery.pick(function(a) {
        plus.io.resolveLocalFileSystemURL(a, function(entry) {
          plus.io.resolveLocalFileSystemURL("_doc/", function(root) {
            root.getFile("head.jpg", {}, function(file) {
              //文件已存在
              file.remove(function() {
                console.log("file remove success");
                entry.copyTo(root, 'head.jpg', function(e) {
                    var e = e.fullPath + "?version=" + new Date().getTime();
                    document.getElementById("head-img").src = e;
                    document.getElementById("head-img1").src = e;
                    //变更大图预览的src
                    //目前仅有一张图片，暂时如此处理，后续需要通过标准组件实现
                    document.querySelector("#__mui-imageview__group .mui-slider-item img").src = e + "?version=" + new Date().getTime();;
                  },
                  function(e) {
                    console.log('copy image fail:' + e.message);
                  });
              }, function() {
                console.log("delete image fail:" + e.message);
              });
            }, function() {
              //文件不存在
              entry.copyTo(root, 'head.jpg', function(e) {
                  var path = e.fullPath + "?version=" + new Date().getTime();
                  document.getElementById("head-img").src = path;
                  document.getElementById("head-img1").src = path;
                  //变更大图预览的src
                  //目前仅有一张图片，暂时如此处理，后续需要通过标准组件实现
                  document.querySelector("#__mui-imageview__group .mui-slider-item img").src = path;
                },
                function(e) {
                  console.log('copy image fail:' + e.message);
                });
            });
          }, function(e) {
            console.log("get _www folder fail");
          })
        }, function(e) {
          console.log("读取拍照文件错误：" + e.message);
        });
      }, function(a) {}, {
        filter: "image"
      })
    };

    function defaultImg() {
      plus.io.resolveLocalFileSystemURL("_doc/head.jpg", function(entry) {
        var s = entry.fullPath + "?version=" + new Date().getTime();;
        document.getElementById("head-img").src = s;
        document.getElementById("head-img1").src = s;
      }, function(e) {
        document.getElementById("head-img").src = '../images/logo.png';
        document.getElementById("head-img1").src = '../images/logo.png';
      })
    }
    document.getElementById("head-img1").addEventListener('tap', function(e) {
      e.stopPropagation();
    });
    document.getElementById("welcome").addEventListener('tap', function(e) {
      //显示启动导航
      mui.openWindow({
        id: 'guide',
        url: 'guide.html',
        show: {
          aniShow: 'fade-in',
          duration: 300
        },
        waiting: {
          autoShow: false
        }
      });
    });

    function initImgPreview() {
        var imgs = document.querySelectorAll("img.mui-action-preview");
        imgs = mui.slice.call(imgs);
        if (imgs && imgs.length > 0) {
          var slider = document.createElement("div");
          slider.setAttribute("id", "__mui-imageview__");
          slider.classList.add("mui-slider");
          slider.classList.add("mui-fullscreen");
          slider.style.display = "none";
          slider.addEventListener("tap", function() {
            slider.style.display = "none";
          });
          slider.addEventListener("touchmove", function(event) {
            event.preventDefault();
          })
          var slider_group = document.createElement("div");
          slider_group.setAttribute("id", "__mui-imageview__group");
          slider_group.classList.add("mui-slider-group");
          imgs.forEach(function(value, index, array) {
            //给图片添加点击事件，触发预览显示；
            value.addEventListener('tap', function() {
              slider.style.display = "block";
              _slider.refresh();
              _slider.gotoItem(index, 0);
            })
            var item = document.createElement("div");
            item.classList.add("mui-slider-item");
            var a = document.createElement("a");
            var img = document.createElement("img");
            img.setAttribute("src", value.src);
            a.appendChild(img)
            item.appendChild(a);
            slider_group.appendChild(item);
          });
          slider.appendChild(slider_group);
          document.body.appendChild(slider);
          var _slider = mui(slider).slider();
        }
      }
      //************************
      //锁屏设置
      (function($, doc) {
        //$.init();
        $.plusReady(function() {
          var lockStateButton = doc.getElementById("lockState");
          var locker = doc.querySelector('.mui-locker');
          lockStateButton.classList[localStorage['settings:gestures'] ? 'add' : 'remove']('mui-active')
          locker.style.display = localStorage['settings:gestures'] ? 'block' : 'none';
          lockStateButton.addEventListener('toggle', function(event) {
            var isActive = event.detail.isActive;
            locker.style.display = isActive ? 'block' : 'none';
            if (!isActive) {
              localStorage['settings:gestures'] = '';
            }
          }, false);
          var record = [];
          locker.addEventListener('done', function(event) {
            var rs = event.detail;
            if (rs.points.length < 4) {
              plus.nativeUI.toast('设定的手势太简单了');
              record = [];
              rs.sender.clear();
              return;
            }
            record.push(rs.points.join(''));
            if (record.length >= 2) {
              if (record[0] == record[1]) {
                plus.nativeUI.toast('解锁手势设定成功，以后用户只需使用手势解锁而无需输入密码登录。');
                localStorage['settings:gestures'] = record[0];
                localStorage['settings:autoLogin'] = true;
                setTimeout(function() {
                  $.back();
                }, 200);
              } else {
                plus.nativeUI.toast('两次手势不一致,请重新设定');
              }
              rs.sender.clear();
              record = [];
            } else {
              plus.nativeUI.toast('请确认手势设定');
              rs.sender.clear();
            }
          }, false);
        });
      }(mui, document));
  </script>

</html>